<template>
  <div>
    <!--  -->
    <span class="text-h5">icon选择器</span>
    <vIconSelect v-model="currIcon" style="width:180px" dense />
    <!-- {{currIcon}} -->
    <span class="text-h5">icons</span>
    <v-card v-for="(e,i) in icon" :key="i" style="margin-top:12px">
      <v-card-title>
        {{e.title}}
      </v-card-title>
      <v-card-text>
        <v-icon v-for="(icon,index) in e.icon" :key="i + index" style="padding:5px" @click="execCommand(icon)">
          {{icon}}
        </v-icon>
      </v-card-text>
    </v-card>
  </div>
</template>

<script>
import vIconSelect from "@/components/v-icon-select/index.vue"
import { execCommand } from "@/utils/index.js"
import icon from '@/components/v-icon-select/data/index'
export default {
  name: 'components-icon',
  components:{
    vIconSelect
  },
  computed: {
    icon: () => icon
  },
  data(){
    return{
      currIcon:'search'
    }
  },
  methods: {
    execCommand(icon){
      execCommand(icon).then(res => {
        alert('复制成功')
      })
    }
  }
}
</script>
